<template>
  <el-card class="quick-entry-card">
    <div class="custom-tabs-label">
      <svg
        xmlns="http://www.w3.org/2000/svg"
        width="24"
        height="25"
        viewBox="0 0 24 25"
        fill="none"
      >
        <path
          fill-rule="evenodd"
          clip-rule="evenodd"
          d="M7.80188 3H5.19788C3.71088 3 2.49988 4.21 2.49988 5.698V8.302C2.49988 9.79 3.71088 11 5.19788 11H7.80188C9.28988 11 10.4999 9.79 10.4999 8.302V5.698C10.4999 4.21 9.28988 3 7.80188 3Z"
          fill="#007BFF"
        />
        <path
          fill-rule="evenodd"
          clip-rule="evenodd"
          d="M17.5002 11C19.7062 11 21.5002 9.206 21.5002 7C21.5002 4.794 19.7062 3 17.5002 3C15.2942 3 13.5002 4.794 13.5002 7C13.5002 9.206 15.2942 11 17.5002 11Z"
          fill="#007BFF"
        />
        <path
          fill-rule="evenodd"
          clip-rule="evenodd"
          d="M18.8019 14H16.1979C14.7109 14 13.4999 15.21 13.4999 16.698V19.302C13.4999 20.79 14.7109 22 16.1979 22H18.8019C20.2899 22 21.4999 20.79 21.4999 19.302V16.698C21.4999 15.21 20.2899 14 18.8019 14Z"
          fill="#007BFF"
        />
        <path
          fill-rule="evenodd"
          clip-rule="evenodd"
          d="M7.80188 14H5.19788C3.71088 14 2.49988 15.21 2.49988 16.698V19.302C2.49988 20.79 3.71088 22 5.19788 22H7.80188C9.28988 22 10.4999 20.79 10.4999 19.302V16.698C10.4999 15.21 9.28988 14 7.80188 14Z"
          fill="#007BFF"
        />
      </svg>
      <span
        style="
          color: var(--Primary4-950, #16191d);
          font-family: 'Source Han Sans CN';
          font-size: 18px;
          font-style: normal;
          font-weight: 500;
          line-height: normal;
          margin-left: 10px;
        "
        >快捷入口</span
      >
    </div>

    <el-row :gutter="10" class="entry-buttons" style="margin-top: 10px">
      <el-col
        v-for="(entry, index) in entries"
        :key="index"
        :xs="12"
        :sm="12"
        :md="12"
        :lg="12"
      >
        <el-button
          class="entry-btn"
          size="small"
          plain
          @click="$emit('entry-click', entry)"
          style="
            color: var(--Primary4-950, #16191d);
            font-family: 'Source Han Sans CN';
            font-size: 16px;
            font-style: normal;
            font-weight: 400;
            line-height: normal;
          "
        >
          {{ entry }}
        </el-button>
      </el-col>
    </el-row>
  </el-card>
</template>

<script setup>
defineProps({
  entries: {
    type: Array,
    default: () => [],
  },
});

defineEmits(["entry-click"]);
</script>

<style lang="scss" scoped>
@import "../../style/HR.scss";

.quick-entry-card {
  border-radius: 8px !important;
  border: 1px solid #fff !important;
  background: #fcfcfd !important;

  /* 阴影1 */
  box-shadow: -38px 83px 25px 0px rgba(168, 168, 189, 0),
    -24px 53px 23px 0px rgba(168, 168, 189, 0.01),
    -14px 30px 20px 0px rgba(168, 168, 189, 0.02),
    -6px 13px 15px 0px rgba(168, 168, 189, 0.03),
    -2px 3px 8px 0px rgba(168, 168, 189, 0.04) !important;
}
</style>
